<template>
  <ul v-if="menuStore.menuShow" class="operator-container no-drag">
    <li v-if="menuStore.showOperate" @click="handleOperator('min')">
      <el-icon><Minus /></el-icon>
    </li>
    <li v-if="menuStore.showOperate"  @click="handleOperator('max')">
      <el-icon><FullScreen /></el-icon>
    </li>
    <li  @click="handleOperator('close')">
      <el-icon><Close /></el-icon>
    </li>
  </ul>
</template>
<script setup>
import { Minus , FullScreen , Close } from '@element-plus/icons-vue'
import {useMenuStore} from '@/stores/menu'
const menuStore = useMenuStore()

const handleOperator = (operator) => {
  window.ipcRenderer.send('operateWindow', operator)
}


</script>


<style scoped lang="less">
.operator-container {
  position: absolute;
  right: 0;
  top: 0;
  display: flex;
  li {
    width: 50px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    color: black;
    font-size: 16px;
  }
  li:hover {
    background-color: rgb(225, 225, 225);
  }

  >li:last-child:hover {
    background-color: rgb(237, 76, 76);
    color: white;
  }
}
</style>
